<template>
	<view>
		<view class="gl-header">
			<view class="gl-header-left" style="gap: 10px; flex-wrap: wrap;">
				<uni-search-bar v-model="search" placeholder="关键字搜索" cancelButton="none"
					@confirm="refresh"></uni-search-bar>
			</view>
			<view class="gl-header-right">
				<view class="gl-button gl-button-base" hover-class="button-base-hover" :hover-stay-time="100"
					@click="refresh">
					<uni-icons type="reload" size="18" color="#fff"></uni-icons>
					<text style="font-size: small;">刷新</text>
				</view>
			</view>
		</view>
		<view class="gl-body">
			<scroll-view scroll-y :style="{height:swiperH+'px'}">
				<view style="background-color: #f8f8f8;font-size: x-small;">页面开发中...</view>
			</scroll-view>
		</view>
		<view class="gl-footer">
			<uni-pagination :show-icon="true" :total="count" :pageSize="size" v-model="page" title="翻页"
				@change="refresh" />
		</view>
	</view>
</template>

<script>
	import psMethod from '@/common/psMethod';
	export default {
		data() {
			return {
				swiperH: 0,
				count: 0, // 记录数
				page: 1, // 当前页
				size: 50, // 页大小								
				sConf: getApp().globalData,
				search: '',
			}
		},
		mounted() {
			console.log('页面挂载');
			let window = uni.getWindowInfo();
			this.designLayout(window.windowHeight);
			this.loadDefData()
		},
		methods: {
			designLayout(wh) {
				this.$nextTick(() => {
					const query = uni.createSelectorQuery().in(this);
					query.select('.gl-body').boundingClientRect();
					query.select('.gl-footer').boundingClientRect();
					query.exec((res) => {
						this.swiperH = wh - Math.ceil(res[0].top) - Math.ceil(res[1].height) - 10;
					});
				})
			},
			async loadDefData() {
				this.refresh()
			},
			refresh() {
				console.log('refresh');
			}
		}
	}
</script>

<style lang="scss" scoped></style>